<template>
  <div class="app-container">
    <!-- 添加或修改病员急救信息对话框 -->
    <h2 style="text-align: center;margin-bottom: 50px;">调度信息表单</h2>
    <div class="form-content">
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="120调度流水标识" prop="trans120" label-width="130px">
          <el-input v-model="form.trans120" placeholder="请输入120调度流水标识" />
        </el-form-item>
        <el-form-item label="患者姓名" prop="name">
          <el-input v-model="form.name" placeholder="请输入患者姓名" />
        </el-form-item>

        <el-form-item label="患者电话" prop="phone">
          <el-input v-model="form.phone" placeholder="请输入患者电话" />
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input v-model="form.remark" placeholder="请输入备注" />
        </el-form-item>
        <el-row>
          <el-col :span="12">
            <el-form-item label="性别">
              <el-select v-model="form.sex" placeholder="请选择性别" style="width: 90%;">
                <el-option v-for="dict in sexOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="parseInt(dict.dictValue)"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="年龄" prop="age">
              <el-input v-model="form.age" placeholder="请输入年龄" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="病人住址" prop="address">
          <el-input v-model="form.address" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-form-item label="报警人电话" prop="callPhone" label-width="92px">
          <el-input v-model="form.callPhone" placeholder="请输入报警人电话" />
        </el-form-item>
        <el-form-item label="病发地点" prop="patientLocal">
          <el-input v-model="form.patientLocal" placeholder="请输入病发地点" />
        </el-form-item>
        <!--        <el-form-item label="病人录音文件" prop="patientRecords">
          <el-input v-model="form.patientRecords" placeholder="请输入病人录音文件" />
        </el-form-item> -->

        <el-form-item label="身份证号" prop="patientCard">
          <el-input v-model="form.patientCard" placeholder="请输入身份证号" />
        </el-form-item>
        <el-form-item label="车辆类型">
          <el-select v-model="form.phoneType" placeholder="请选择车辆类型">
            <el-option v-for="dict in phoneTypeOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="parseInt(dict.dictValue)"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="主诉" prop="majorCase">
          <el-input v-model="form.majorCase" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-form-item label="目标医院" prop="hospital">
          <el-input v-model="form.hospital" placeholder="请输入目标医院" />
        </el-form-item>
        <el-form-item label="体检结果" prop="checkResult">
          <el-input v-model="form.checkResult" placeholder="请输入体检结果" />
        </el-form-item>
        <el-form-item label="初步诊断" prop="firstTreat">
          <el-input v-model="form.firstTreat" placeholder="请输入初步诊断" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm" style="float:right;margin-right: 50px;">确 定</el-button>
      </div>
    </div>
  </div>
</template>

<script>
  import {
    addPatient
  } from "@/api/biz/patient";

  export default {
    name: "Patient",
    data() {
      return {
        // 遮罩层
        loading: true,
        // 性别字典
        sexOptions: [],
        // 是否处理字典
        statusOptions: [],
        // 车辆类型字典
        phoneTypeOptions: [],
        // 表单参数
        form: {},
        // 表单校验
        rules: {
          trans120: [{
            required: true,
            message: "120调度流水标识不能为空",
            trigger: "blur"
          }],
          name: [{
              required: true,
              message: "患者姓名不能为空",
              trigger: "blur"
            },
            {
              pattern: /^[\u4E00-\u9FA5\uf900-\ufa2d·s]{2,20}$/,
              message: "姓名格式错误",
              trigger: "blur"
            }
          ],
          phone: [{
              required: true,
              message: "患者电话不能为空",
              trigger: "blur"
            },
            {
              pattern: /^1(3|4|5|7|8|9)\d{9}$/,
              message: "手机号格式错误",
              trigger: "blur"
            }
          ],

          sex: [{
            required: true,
            message: "性别不能为空",
            trigger: "change"
          }],
          address: [{
            required: true,
            message: "病人住址不能为空",
            trigger: "blur"
          }],
          callPhone: [{
              required: true,
              message: "报警人电话不能为空",
              trigger: "blur"
            },
            {
              pattern: /^1(3|4|5|7|8|9)\d{9}$/,
              message: "手机号格式错误",
              trigger: "blur"
            }
          ],
          sex: [{
            required: true,
            message: "性别不能为空",
            trigger: "change"
          }],
          age: [{
              required: true,
              message: "年龄不能为空",
              trigger: "blur"
            },
            {
              pattern: /^(?:[1-9][0-9]?|1[01][0-9]|120)$/,
              message: "超过年龄范围1~120",
              trigger: "blur"
            }
          ],
          patientCard: [{
              required: true,
              message: "身份证号不能为空",
              trigger: "blur"
            },
            {
              pattern: /(^bai\d{15}$)|du(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
              message: "身份证号格式错误",
              trigger: "blur"
            }
          ],
          patientLocal: [{
            required: true,
            message: "并发地点不能为空",
            trigger: "blur"
          }],
          majorCase: [{
            required: true,
            message: "主诉不能为空",
            trigger: "blur"
          }],
          hospital: [{
            required: true,
            message: "目标医院不能为空",
            trigger: "blur"
          }],
          checkResult: [{
            required: true,
            message: "体检结果不能为空",
            trigger: "blur"
          }],
          firstTreat: [{
            required: true,
            message: "初步诊断不能为空",
            trigger: "blur"
          }],
        }
      };
    },
    created() {
      this.reset();
      this.getDicts("sys_user_sex").then(response => {
        this.sexOptions = response.data;
      });
      this.getDicts("car_type").then(response => {
        this.phoneTypeOptions = response.data;
      });
    },
    methods: {
      // 性别字典翻译
      sexFormat(row, column) {
        return this.selectDictLabel(this.sexOptions, row.sex);
      },

      // 车辆类型字典翻译
      phoneTypeFormat(row, column) {
        return this.selectDictLabel(this.phoneTypeOptions, row.phoneType);
      },
      // 取消按钮
      cancel() {
        this.reset();
      },
      // 表单重置
      reset() {
        this.form = {
          patientId: undefined,

          trans120: undefined,

          name: undefined,

          phone: undefined,

          remark: undefined,

          sex: undefined,

          age: undefined,

          address: undefined,

          callPhone: undefined,

          time: undefined,

          patientLocal: undefined,

          patientRecords: undefined,

          receiveNoticeTime: undefined,

          status: undefined,

          patientCard: undefined,

          phoneType: undefined,

          uid: undefined,

          majorCase: undefined,

          hospital: undefined,

          checkResult: undefined,

          firstTreat: undefined,

        };
        this.resetForm("form");
      },

      /** 新增按钮操作 */
      handleAdd() {
        this.reset();
        this.open = true;
        this.title = "添加病员急救信息";
      },
      jumpToCompon: function() {
        this.$router.push('/dispatch/patient');
      },
      /** 提交按钮 */
      submitForm: function() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            addPatient(this.form).then(response => {
              if (response.code === 200) {
                this.msgSuccess("新增成功");
                this.jumpToCompon();
              } else {
                this.msgError(response.msg);
              }
            });
          }
        });
      },
    }
  };
</script>
<style>
  .form-content {
    width: 800px;
    margin: auto;
  }
</style>
